﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<IEnumerable<MyVoteMVC.Web.Models.Item>>" %>

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
    活动详细
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
    <script language="JavaScript">
        function saveTicket() {
            $("#btnsave").attr('disabled', 'disabled');
            document.forms[0].method = "post";
            document.forms[0].action = document.forms[0].action.replace('ProjectDetails', 'Save');
            document.forms[0].submit();
            return true;
        }

        function submitTicket() {
            $("#btnsubmit").attr('disabled', 'disabled');
            document.forms[0].method = "post";
            document.forms[0].action = document.forms[0].action.replace('ProjectDetails', 'Save');
            document.forms[0].action = document.forms[0].action.replace('Save', 'Submit');
            document.forms[0].submit();
            return true;
        }
        if ('<%= TempData["ModelErrorMsg"] %>' != '') {
            alert('<%= TempData["ModelErrorMsg"] %>');
        }
    </script>
    <div>
        <div class="title">
            <h1>
                <%= Model.Count() > 0 ? Model.FirstOrDefault().ActivityTitle:string.Empty %><span></span></h1>
            <p>
                <%= Model.Count() > 0 ? Model.FirstOrDefault().ActivityContent : string.Empty%></p>
        </div>
        <a href="#"></a>
        <ul id="filter">
            <li>按项目年份：
                <label>
                    <input type="radio" name="year" value="all" checked="checked">全部</label>
                <% foreach (string year in (List<string>)ViewData["yearList"])
                   { %>
                <label>
                    <input type="radio" name="year" value="<%= year %>"><%= year%>年代</label>
                <%} %>
            </li>
            <li>按项目类型：
                <label>
                    <input type="radio" name="type" value="all" checked="checked">全部</label>
                <% foreach (string type in (List<string>)ViewData["typeList"])
                   { %>
                <label>
                    <input type="radio" name="type" value="<%= type %>"><%= type%></label>
                <%} %>
            </li>
        </ul>
        <% Html.BeginForm(); %>
        <%: Html.ValidationSummary(true, "Login was unsuccessful. Please correct the errors and try again.") %>
        <div id="demo" class="demo">
            <% 
                string[] checkedRecords = (string[])ViewData["checkedRecords"];
                foreach (IGrouping<string, Item> Group in Model.GroupBy(o => o.QID))
                {%>
            <ul class="splitter">
                <li>
                    <%= Group.First().QuestionTitle%>:<%= Group.First().QuestionContent %></li></ul>
            <% Html.Telerik().Grid(Group)
                            .Name(Group.First().QuestionNo)
                            .DataKeys(keys => keys.Add(o => o.ID))
                            .Columns(columns =>
                                {
                                    columns.Template(o =>
                                        {
            %>
            <input name="<%= o.QID %>" pid="<%= o.PID %>" qno="<%= o.QuestionNo %>" multi="5"
                type="checkbox" value="<%= o.ID %>" title="checkedRecords" <% if (checkedRecords.Contains(o.ID)) {                        
                                                    %> checked="checked" <%
                                                  } %> />
            <%
                                        }).Title("").Width(36).HtmlAttributes(new { style = "text-align:center" });
                                    columns.Bound(o => o.pName).Title("名称").Width(200);
                                    columns.Bound(o => o.pYear).Title("年份").Width(100);
                                    columns.Bound(o => o.pType).Title("类型").Width(100);
                                    columns.Bound(o => o.pYearGroup).Title("年代").Hidden(true);
                                })
                                .ClientEvents(events => events
                                    .OnRowSelect("onRowSelect")
                                    ).HtmlAttributes(new { id = "detailtable", style = "background:#1c1c1c;" })

                             .Selectable()
                             .Sortable(sorting=>sorting.OrderBy(order=>order.Add(o=>o.pYear)))
                             .Render();%>
            <%} %>
        </div>
        <ul class="splitter">
            <li>
                <% if ((bool)ViewData["ticketSubmit"])
                   {%>
                <button class="t-button" id="btnsubmit" onclick="submitTicket()">
                    确定投票</button>
                <button class="t-button" id="btnsave" onclick="saveTicket()">
                    临时保存</button><%}
                   else if ((bool)ViewData["showStatistics"])
                   {%>&nbsp; <a class="t-button" target="_blank" href="<%= Url.Action("VoteResult","Home",new {id = ViewContext.RouteData.Values["ID"].ToString()}) %>">
                       查看结果</a>
                <%} %></li>
        </ul>
        <% Html.EndForm(); %>
    </div>
    <div id="divWatermark" class="splitter" style="position: absolute; bottom: 0px; right: 0px; color: red;
        width: 150px; height: 30px; margin:0; padding:0">
        <%foreach (IGrouping<string, Item> Group in Model.GroupBy(o => o.QID))
          { %>
        <p>
            <b>
                <%=Group.First().QuestionNo %></b>、需选<b><%=Group.First().QuestionMulti %></b>项：已选<span>0</span>项。</p>
        <%} %>
    </div>
    <script type="text/javascript">    

    function onRowSelect(e) {
        var row = e.row;
        var iid = $('input:checkbox', row).eq(0).attr("value");
        $('#projectInfo').fadeOut();
        $.post("/home/ProjectByItemId/" + iid, function (response) {
            $('#projectInfo').html(response);
            $('#projectInfo').fadeIn();
        });
    }

    $('input[title="checkedRecords"]').change(function (e) {

        $(this).parent().parent().find("td").css({ "color": "white" });

        var $selected = $('input[title="checkedRecords"]:checked');
        $selected.each(function (index) { $(this).parent().parent().find("td").css({ "color": "red" }); });

        var $spans = $("#divWatermark span");
        $spans.eq(0).text($selected.length);

        if ($selected.length.toString() == $("#divWatermark b").eq(1)[0].innerText)
            $("#btnsubmit").show();
        else
            $("#btnsubmit").hide();

    });

    $('#filter input').change(function (e) {
        var $selecttype = $('#filter input[name="type"]:checked').val();
        var $selectyear = $('#filter input[name="year"]:checked').val();
        var table = $('#detailtable');
        var rows = $('tr', table);
        rows.each(function (index) {
            if (index > 0) {
                if ($selecttype == 'all' && $selectyear == 'all') {
                    $(this).show();
                }
                else if ($selecttype == 'all' && $selectyear != 'all') {
                    if ($("td", this).eq(4).text() == $selectyear) {
                        $(this).show();
                    } else {
                        $(this).hide();
                    }
                }
                else if ($selecttype != 'all' && $selectyear == 'all') {
                    if ($("td", this).eq(3).text() == $selecttype) {
                        $(this).show();
                    } else {
                        $(this).hide();
                    }
                } else {
                    if ($("td", this).eq(3).text() == $selecttype && $("td", this).eq(4).text() == $selectyear) {
                        $(this).show();
                    } else {
                        $(this).hide();
                    }
                }
            }
        });
    });
    $(function () {
        $.fancybox.helpers.buttons = {
            tpl: '<div id="fancybox-buttons"><ul><li><a class="btnClose" title="关闭" href="javascript:$.fancybox.close();">Close</a></li></ul></div>'
        }
        var $selected = $('input[title="checkedRecords"]:checked');
        $selected.each(function (index) { $(this).parent().parent().find("td").css({ "color": "red" }); });
        var $spans = $("#divWatermark span");
        $spans.eq(0).text($selected.length);
        $("#btnsubmit").hide();

        $(".t-link").click(function (e) { e.preventDefault(); if (confirm("排序操作之前请先确认当前选项已保存。")) { window.location.href = $(this).attr("href") } });
    });

    window.onscroll = function () {
        var oWatermark = document.getElementById("divWatermark");
        oWatermark.style.top = document.documentElement.scrollTop + document.documentElement.clientHeight - 30+"px";
    }

    </script>
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="HeadContent" runat="server">
</asp:Content>
